<template>
  <div>
    <el-card>
      <div class="top">
        <el-row>
          <p style="font-size: 18px">班级管理</p>
          <el-button size="small" class="button1 el-icon-delete" type="warning">
            删除</el-button
          >
          <el-button
            size="small"
            style="height: 30px; margin-top: 12px"
            class="el-icon-folder-add"
            type="success"
            @click="dialogFormVisible = true"
          >
            添加课程</el-button
          >
          <el-input
            placeholder="请输入内容"
            class="input-with-select"
            v-model="queryinfo.name"
          >
            <template #prepend>
              <el-select
                v-model="queryinfo.courseid"
                style="width: 100px"
                placeholder="请选择"
              >
                <el-option
                  v-for="item in toparea"
                  :key="item.id"
                  :label="item.name"
                  :value="item.id"
                ></el-option>
              </el-select>
            </template>
            <template #append>
              <el-button icon="el-icon-search" @click="classList"></el-button>
            </template>
          </el-input>
        </el-row>
      </div>
    </el-card>
    <el-card>
      <div class="box">
        <!-- 列表 -->
        <el-table
          ref="multipleTable"
          :data="student"
          tooltip-effect="dark"
          style="width: 100%"
        >
          <!--@selection-change="handleSelectionChange" -->
          <el-table-column type="selection" width="100"> </el-table-column>
          <div class="el-icon-heavy-rain"></div>

          <el-table-column prop="name" label="班级姓名" width="180">
          </el-table-column>
          <el-table-column prop="coursename" label="课程" width="180">
          </el-table-column>
          <el-table-column prop="teacherslist" label="老师" width="180">
            <template v-slot:default="scopen">
              {{ scopen.row.teacherslist ? "不会" : "null" }}
            </template>
          </el-table-column>
          <el-table-column prop="students" label="人数" width="120">
          </el-table-column>
          <el-table-column prop="coursecounts" label="计划课时" width="120">
          </el-table-column>
          <el-table-column prop="schcourses" label="已排课时" width="120">
          </el-table-column>
          <el-table-column prop="endcourses" label="已上课时" width="120">
          </el-table-column>
          <el-table-column prop="" label="操作" show-overflow-tooltip>
            <template #default="scope">
              <el-row>
                <div class="nan1" @click="paike">排课</div>
                <div class="nan2" @click="edit(scope.row)">编辑</div>
                <div class="nan2" @click="kbiao(scope.row)">课表</div>
                <div class="nan2" @click="claaDelete(scope.row.id)">删除</div>
              </el-row>
            </template>
          </el-table-column>
        </el-table>
        <!-- 列表 -->
        <!-- 分页 -->
        <div class="block">
          <el-pagination
            @size-change="handleSizeChange"
            @current-change="handleCurrentChange"
            :current-page="queryinfo.page"
            :page-sizes="[1, 8, 15]"
            :page-size="queryinfo.psize"
            layout="total, sizes, prev, pager, next, jumper"
            :total="total"
          >
          </el-pagination>
        </div>
        <!-- 分页 -->
      </div>
    </el-card>
    <!-- 添加 -->
    <el-dialog title="添加学员" width="40%" v-model="dialogFormVisible">
      <div style="margin: 10px"></div>
      <el-form
        label-width="80px"
        :model="classform"
        :rules="rules"
        ref="inserform"
      >
        <el-form-item label="所选课程" prop="courseid">
          <el-select
            v-model="classform.courseid"
            clearable
            placeholder="请选择课程"
          >
            <el-option
              v-for="item in toparea"
              :key="item.id"
              :label="item.name"
              :value="item.id"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="班级名称" prop="name">
          <el-input style="width: 300px" v-model="classform.name"></el-input>
        </el-form-item>
        <el-form-item label="计划课时" prop="coursecounts">
          <el-input
            style="width: 300px"
            v-model="classform.coursecounts"
          ></el-input>
        </el-form-item>
        <el-form-item label="开班日期" prop="startdate">
          <!-- <el-col :span="11"> -->
            <el-date-picker
            type="date"
            placeholder="选择日期"
            v-model="classform.startdate"
            format="YYYY 年 MM 月 DD 日"
            value-format="YYYY/MM/DD"
          ></el-date-picker>
          <!-- </el-col> -->
        </el-form-item>
        <el-form-item label="结班日期" prop="enddate">
          <!-- <el-col :span="11"> -->
            <el-date-picker
            type="date"
            placeholder="选择日期"
            v-model="classform.enddate"
            format="YYYY 年 MM 月 DD 日"
            value-format="YYYY/MM/DD"
          ></el-date-picker>
          <!-- </el-col> -->
        </el-form-item>
      </el-form>
      <template #footer>
        <span class="dialog-footer">
          <el-button type="primary" @click="classadd('inserform')"
            >确 定</el-button
          >
          <el-button @click="dialogFormVisible = false">取 消</el-button>
        </span>
      </template>
    </el-dialog>
    <!-- 添加 -->
    <!-- 修改 -->
    <el-dialog title="修改学员" width="40%" v-model="dialogFormVisiblea">
      <div style="margin: 10px"></div>
      <el-form
        label-width="80px"
        :model="editform"
        :rules="rules"
        ref="inserform"
      >
        <el-form-item label="所选课程" prop="courseid">
          <el-select
            v-model="editform.courseid"
            clearable
            placeholder="请选择课程"
          >
            <el-option
              v-for="item in toparea"
              :key="item.id"
              :label="item.name"
              :value="item.id"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="班级名称" prop="name">
          <el-input style="width: 300px" v-model="editform.name"></el-input>
        </el-form-item>
        <el-form-item label="计划课时" prop="coursecounts">
          <el-input
            style="width: 300px"
            v-model="editform.coursecounts"
          ></el-input>
        </el-form-item>
        <el-form-item label="开班日期" prop="startdate">
          <!-- <el-col :span="11"> -->
            <el-date-picker
            type="date"
            placeholder="选择日期"
            v-model="editform.startdate"
            format="YYYY 年 MM 月 DD 日"
            value-format="YYYY/MM/DD"
          ></el-date-picker>
          <!-- </el-col> -->
        </el-form-item>
        <el-form-item label="结班日期" prop="enddate">
          <!-- <el-col :span="11"> -->
            <el-date-picker
            type="date"
            placeholder="选择日期"
            v-model="editform.enddate"
            format="YYYY 年 MM 月 DD 日"
            value-format="YYYY/MM/DD"
          ></el-date-picker>
          <!-- </el-col> -->
        </el-form-item>
      </el-form>
      <template #footer>
        <span class="dialog-footer">
          <el-button type="primary" @click="classedit('inserform')"
            >确 定</el-button
          >
          <el-button @click="dialogFormVisiblea = false">取 消</el-button>
        </span>
      </template>
    </el-dialog>
    <!-- 修改 -->
    <!-- 排课 -->
    <el-dialog title="排课" width="70%" v-model="dialogFormVisibleb">
      <div style="margin: 10px"></div>
      <el-row>
        <el-form
          :inline="true"
          class="demo-form-inline"
          :label-position="labelPosition"
        >
          <div class="nan">
            <div class="nan2">
              <el-form-item size="medium">
                <div style="margin-bottom: 5px">
                  <span><font color="red">*</font> 主教老师</span
                  >&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span
                    @click="none"
                    style="color: #15b0ff; cursor: pointer"
                    >添加助教</span
                  >
                </div>

                <el-select placeholder="活动区域" style="width: 150px">
                  <el-option label="区域一" value="shanghai"></el-option>
                </el-select>
              </el-form-item>
            </div>
            <div class="nan2" v-show="buhui">
              <el-form-item size="medium">
                <div style="margin-bottom: 5px">
                  <span>助教老师</span>
                </div>

                <el-select placeholder="活动区域" style="width: 150px">
                  <el-option label="区域一" value="shanghai"></el-option>
                </el-select>
              </el-form-item>
            </div>
            <div class="nan2">
              <el-form-item label="" size="medium">
                <div style="margin-bottom: 5px"><span>教室</span></div>
                <el-select placeholder="活动区域" style="width: 150px">
                  <el-option label="区域一" value="shanghai"></el-option>
                </el-select>
              </el-form-item>
            </div>
            <div class="nan2">
              <el-form-item label="" size="medium">
                <div style="margin-bottom: 4px">
                  <span><font color="red">*</font> 单节课扣学员课时</span>
                </div>
                <el-input placeholder="审批人" style="width: 150px"></el-input>
              </el-form-item>
            </div>
          </div>
          <div class="nana">
            <el-menu
              :default-active="activeIndex"
              class="el-menu-demo"
              mode="horizontal"
              @select="handleSelect"
              text-color="#333"
              active-text-color="#0074d9"
            >
              <el-menu-item index="1" style="font-size: 15px" @click="none11"
                >单次排课</el-menu-item
              >
              <el-menu-item index="2" style="font-size: 15px" @click="none1"
                >批量排课</el-menu-item
              >
            </el-menu>
          </div>
          <div class="nanb">
            <div class="nan2">
              <el-form-item label="" required>
                <span>开课日期</span>
                <el-date-picker
                  type="date"
                  placeholder="选择日期"
                  style="width: 150px"
                ></el-date-picker>
              </el-form-item>
            </div>
            <div class="nan2" v-show="buhui1">
              <el-form-item label="">
                <span>结束方式</span>
                <el-radio-group v-model="radio">
                  <el-radio label="1" v-model="radio" @click="button1"
                    >按课节</el-radio
                  >
                  <el-radio label="2" v-model="radio" @click="button2"
                    >按日期</el-radio
                  >
                </el-radio-group>
              </el-form-item>
            </div>
            <div class="nan2" v-show="buhui2">
              <el-form-item label="" size="medium">
                <div style="margin-bottom: 4px">
                  <span><font color="red">*</font> 排课总数</span>
                </div>
                <el-input placeholder="审批人" style="width: 150px"></el-input>
              </el-form-item>
            </div>
            <div class="nan2" v-show="jieshu">
              <el-form-item label="" required>
                <span>结课日期</span>
                <el-date-picker
                  type="date"
                  placeholder="选择日期"
                  style="width: 150px"
                ></el-date-picker>
              </el-form-item>
            </div>
          </div>
          <div class="nanc" v-show="nangao1">
            <div class="nanzi"><font color="red">*</font> 上课时间</div>
            <div class="nan2">
              <el-form-item label="" required>
                <el-col :span="11">
                  <el-form-item prop="date1">
                    <el-time-picker
                      placeholder="起始时间"
                      style="width: 150px"
                    ></el-time-picker>
                  </el-form-item>
                </el-col>
                <el-col class="line" :span="2"> -- </el-col>
                <el-col :span="11">
                  <el-form-item prop="date2">
                    <span></span>
                    <el-time-picker
                      placeholder="结束时间"
                      style="width: 150px"
                    ></el-time-picker>
                  </el-form-item>
                </el-col>
              </el-form-item>
            </div>
          </div>
          <div class="nanc" v-show="nangao2">
            <div class="nanzi"><font color="red">*</font> 星期选择</div>
            <div class="nan2">
              <el-form-item required>
                <el-checkbox-group v-model="aaa">
                  <el-checkbox label="星期日" @change="ar"></el-checkbox>
                  <el-checkbox label="星期一" @change="a1"></el-checkbox>
                  <el-checkbox label="星期二" @change="a2"></el-checkbox>
                  <el-checkbox label="星期三" @change="a3"></el-checkbox>
                  <el-checkbox label="星期四" @change="a4"></el-checkbox>
                  <el-checkbox label="星期五" @change="a5"></el-checkbox>
                  <el-checkbox label="星期六" @change="a6"></el-checkbox>
                </el-checkbox-group>
              </el-form-item>
            </div>
          </div>
          <div class="nancc">
            <div class="nancc5" v-show="xqr">
              <div class="nanzi">周日时间</div>
              <div class="nan2">
                <el-form-item label="" required>
                  <el-col :span="11">
                    <el-form-item prop="date1">
                      <el-time-picker
                        placeholder="00:00"
                        style="width: 190px"
                      ></el-time-picker>
                    </el-form-item>
                  </el-col>
                  <el-col class="line" :span="2">-</el-col>
                  <el-col :span="11">
                    <el-form-item prop="date2">
                      <span></span>
                      <el-time-picker
                        placeholder="00:00"
                        style="width: 190px"
                      ></el-time-picker>
                    </el-form-item>
                  </el-col>
                </el-form-item>
              </div>
            </div>
            <div class="nancc5" v-show="xq1">
              <div class="nanzi">周一时间</div>
              <div class="nan2">
                <el-form-item label="" required>
                  <el-col :span="11">
                    <el-form-item prop="date1">
                      <el-time-picker
                        placeholder="00:00"
                        style="width: 190px"
                      ></el-time-picker>
                    </el-form-item>
                  </el-col>
                  <el-col class="line" :span="2">-</el-col>
                  <el-col :span="11">
                    <el-form-item prop="date2">
                      <span></span>
                      <el-time-picker
                        placeholder="00:00"
                        style="width: 190px"
                      ></el-time-picker>
                    </el-form-item>
                  </el-col>
                </el-form-item>
              </div>
            </div>
            <div class="nancc5" v-show="xq2">
              <div class="nanzi">周二时间</div>
              <div class="nan2">
                <el-form-item label="" required>
                  <el-col :span="11">
                    <el-form-item prop="date1">
                      <el-time-picker
                        placeholder="00:00"
                        style="width: 190px"
                      ></el-time-picker>
                    </el-form-item>
                  </el-col>
                  <el-col class="line" :span="2">-</el-col>
                  <el-col :span="11">
                    <el-form-item prop="date2">
                      <span></span>
                      <el-time-picker
                        placeholder="00:00"
                        style="width: 190px"
                      ></el-time-picker>
                    </el-form-item>
                  </el-col>
                </el-form-item>
              </div>
            </div>
            <div class="nancc5" v-show="xq3">
              <div class="nanzi">周三时间</div>
              <div class="nan2">
                <el-form-item label="" required>
                  <el-col :span="11">
                    <el-form-item prop="date1">
                      <el-time-picker
                        placeholder="00:00"
                        style="width: 190px"
                      ></el-time-picker>
                    </el-form-item>
                  </el-col>
                  <el-col class="line" :span="2">-</el-col>
                  <el-col :span="11">
                    <el-form-item prop="date2">
                      <span></span>
                      <el-time-picker
                        placeholder="00:00"
                        style="width: 190px"
                      ></el-time-picker>
                    </el-form-item>
                  </el-col>
                </el-form-item>
              </div>
            </div>
            <div class="nancc5" v-show="xq4">
              <div class="nanzi">周四时间</div>
              <div class="nan2">
                <el-form-item label="" required>
                  <el-col :span="11">
                    <el-form-item prop="date1">
                      <el-time-picker
                        placeholder="00:00"
                        style="width: 190px"
                      ></el-time-picker>
                    </el-form-item>
                  </el-col>
                  <el-col class="line" :span="2">-</el-col>
                  <el-col :span="11">
                    <el-form-item prop="date2">
                      <span></span>
                      <el-time-picker
                        placeholder="00:00"
                        style="width: 190px"
                      ></el-time-picker>
                    </el-form-item>
                  </el-col>
                </el-form-item>
              </div>
            </div>
            <div class="nancc5" v-show="xq5">
              <div class="nanzi">周五时间</div>
              <div class="nan2">
                <el-form-item label="" required>
                  <el-col :span="11">
                    <el-form-item prop="date1">
                      <el-time-picker
                        placeholder="00:00"
                        style="width: 190px"
                      ></el-time-picker>
                    </el-form-item>
                  </el-col>
                  <el-col class="line" :span="2">-</el-col>
                  <el-col :span="11">
                    <el-form-item prop="date2">
                      <span></span>
                      <el-time-picker
                        placeholder="00:00"
                        style="width: 190px"
                      ></el-time-picker>
                    </el-form-item>
                  </el-col>
                </el-form-item>
              </div>
            </div>
            <div class="nancc5" v-show="xq6">
              <div class="nanzi">周六时间</div>
              <div class="nan2">
                <el-form-item label="" required>
                  <el-col :span="11">
                    <el-form-item prop="date1">
                      <el-time-picker
                        placeholder="00:00"
                        style="width: 190px"
                      ></el-time-picker>
                    </el-form-item>
                  </el-col>
                  <el-col class="line" :span="2">-</el-col>
                  <el-col :span="11">
                    <el-form-item prop="date2">
                      <span></span>
                      <el-time-picker
                        placeholder="00:00"
                        style="width: 190px"
                      ></el-time-picker>
                    </el-form-item>
                  </el-col>
                </el-form-item>
              </div>
            </div>
          </div>
        </el-form>
        <div class="nand">
          <div class="nand1">选择学员(100)</div>
          <div class="nand2 el-icon-user">添加学员</div>
        </div>
      </el-row>
      <template #footer>
        <span class="dialog-footer">
          <el-button type="primary" @click="classedit('inserform')"
            >确 定</el-button
          >
          <el-button @click="dialogFormVisibleb = false">取 消</el-button>
        </span>
      </template>
    </el-dialog>
    <!-- 排课 -->
    <!-- 课表 -->
    <el-dialog title="课表" width="90%" v-model="dialogFormVisiblec">
      <div style="margin: 10px"></div>
      <div class="sss">
        <div class="kebiao1">
          <div class="kebiaoa">
            <span>{{ kbiaoaa.name }}</span>
          </div>
          <div class="kebiaob">
            <ul class="kebiaob1">
              <li class="kebiao2">
                课程：<span>{{ kbiaoaa.coursename }}</span>
              </li>
              <li class="kebiao2">
                老师：<span>{{
                  kbiaoaa.teacherslist
                    ? kbiaoaa.teacherslist == kbiaoaa.teacherslist
                    : "暂无"
                }}</span>
              </li>
              <li class="kebiao2">人数：<span>2/3</span></li>
            </ul>
            <div class="kebiaob2">
              <el-progress
                :text-inside="true"
                :stroke-width="24"
                width="50px"
                :percentage="100"
                status="success"
              ></el-progress>
            </div>
            <div class="kebiaob3">
              <span class="kbleft">已上{{ kbiaoaa.students }}节课</span>
              <span class="kbright">已排{{ kbiaoaa.schcourses }}节课</span>
            </div>
            <div class="sybs"></div>
          </div>
          <div class="kebiaoc">
            <span class="span1">班级学员（100）</span>
            <span class="span2 el-icon-user">+</span>
          </div>
          <div class="kebb"></div>
        </div>
        <div class="kebiaorl">
          <div class="kebiaorl1">
            <el-tabs v-model="activeName" @tab-click="handleClick">
              <el-tab-pane label="单次排课" name="first"
                ><div class="rili">
                  <el-calendar v-model="value">
                    <template #dateCell="data">
                      <div>
                        <div style="margin-left: 50px">
                          {{ data.data.day.substr(8, 2) }}
                        </div>
                        <div v-for="item in zong" :key="item.i">
                          <div v-if="item.coursedate == data.data.day">
                            <div class="acca">
                              <div class="accb"></div>
                              <div class="accc">
                                <div class="accd">{{ item.coursename }}</div>
                                <div class="accd2">
                                  <span>{{
                                    item.starttime.substr(10, 6)
                                  }}</span>
                                  <span>{{ item.teachername }}</span>
                                </div>
                              </div>
                            </div>
                          </div>
                        </div>
                      </div>
                    </template>
                  </el-calendar>
                </div></el-tab-pane
              >
              <el-tab-pane label="批量排课" name="second"
                >啥也不是................</el-tab-pane
              >
            </el-tabs>
          </div>
        </div>
      </div>
      <template #footer>
        <span class="dialog-footer">
          <el-button type="primary" @click="classedit('inserform')"
            >确 定</el-button
          >
          <el-button @click="dialogFormVisiblec = false">取 消</el-button>
        </span>
      </template>
    </el-dialog>
    <!-- 课表 -->
  </div>
</template>
<script>
export default {
  data() {
    return {
      queryinfo: {
        psize: 8,
        page: 1,
        coursename: "",
        name: "",
      },
      //课表默认打开
      activeName: "first",
      radio: "1",
      buhui: false,
      buhui1: false,
      buhui2: false,
      nangao1: true,
      jieshu: false,
      nangao2: false,
      xqr: false,
      xq1: false,
      xq2: false,
      xq3: false,
      xq4: false,
      xq5: false,
      xq6: false,
      aaa: [],
      zong:[],//课表
      nan: "",
      labelPosition: "top",
      student: [],
      total: [],
      toparea: [],
      dialogFormVisible: false,
      dialogFormVisiblea: false,
      dialogFormVisibleb: false,
      dialogFormVisiblec: false,
      value: new Date(),
      // form: {
      //   keshi: "内碟",
      // },
      kbiaoaa: [],
      classform: {
        courseid: "",
        name: "",
        coursecounts: "",
        startdate: "",
        enddate: "",
      },
      editform: {
        id: "",
        courseid: "",
        name: "",
        coursecounts: "",
        startdate: "",
        enddate: "",
      },
      rules: {
        name: [
          { required: true, message: "请输入班级名称", trigger: "blur" },
          { min: 2, max: 10, message: "长度在 3 到 5 个字符", trigger: "blur" },
        ],
        coursecounts: [
          { required: true, message: "请输入课时", trigger: "blur" },
          { min: 2, max: 10, message: "长度在 3 到 5 个字符", trigger: "blur" },
        ],
        startdate: [
          { required: true, message: "请输选择开课日期", trigger: "blur" },
        ],
        enddate: [
          { required: true, message: "请输选择结课日期", trigger: "blur" },
        ],
        // coursename: [
        //   { required: true, message: "请输选择课程", trigger: "blur" },
        // ],
      },
    };
  },
  created() {
    this.classList();
    this.kecheng();
  },
  methods: {
    //   班级列表
    async classList() {
      const { data: res } = await this.$http.get(
        "http://www.eshareedu.cn/edusystems/api/classes/list",
        { params: this.queryinfo }
      );
      // console.log(res.data)
      // console.log(res);
      if (res.errCode == "10000") {
        this.student = res.data.list;
        this.total = res.data.counts;
      } else {
        this.$message.error("请求班级列表数据失败");
      }
    },
    //   班级列表
    // 分页
    handleSizeChange(val) {
      // console.log(`每页 ${val} 条`);
      this.queryinfo.psize = val;
      this.classList();
    },
    handleCurrentChange(val) {
      this.queryinfo.page = val;
      this.classList();
      // console.log(`当前页: ${val}`);
    },
    // 分页结束
    //删除
    async claaDelete(id) {
      // console.log(id);
      const result = await this.$confirm(
        "此操作将永久删除该记录, 是否继续?",
        "提示",
        {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning",
        }
      ).catch((error) => {
        return error;
      });
      if (result == "confirm") {
        const { data: res } = await this.$http.get(
          "http://www.eshareedu.cn/edusystems/api/classes/delete",
          { params: { id: id } }
        );
        // console.log(res);
        if (res.errCode == 10000) {
          this.$message.success("删除成功");
          this.classList();
        } else {
          this.$message.error("删除失败");
        }
        if (result == "cancel") {
          this.$message.info("已取消删除");
        }
      }
    },
    //删除
    //请求课添加程数据
    async kecheng() {
      const { data: res } = await this.$http.get(
        "http://www.eshareedu.cn/edusystems/api/courses/list"
      );
      //  console.log(res);
      if (!res.errCode == 10000) {
        // this.$message.success()
        this.$message.error("请求课程数据失败");
      }
      this.toparea = res.data.list;
    },
    //请求课添加程数据
    //课程添加
    async classadd(inserform) {
      // console.log(inserform);
      let flag = false;
      this.$refs[inserform].validate((res) => {
        // console.log(res);
        if (res == false) {
          flag = true;
        }
      });
      if (flag) {
        return;
      }
      const { data: res } = await this.$http.post(
        "http://www.eshareedu.cn/edusystems/api/classes/add",
        this.classform
      );
      // console.log(res);
      if (!res.errCode == 10000) {
        this.$message.error("添加失败");
      }
      this.$message.success("添加成功");
      this.dialogFormVisible = false;
      // this.$refs[classform].resetFields();
      this.classList();
    },
    //课程添加
    // 班级修改
    edit(row) {
      console.log(row);
      this.dialogFormVisiblea = true;
      this.editform.id = row.id;
      this.student.forEach((item) => {
        if (row.id == item.id) {
          this.editform.courseid = item.courseid;
          this.editform.name = item.name;
          this.editform.coursecounts = item.coursecounts;
          this.editform.startdate = item.startdate;
          this.editform.enddate = item.enddate;
        }
      });
    },
    // 班级修改
    //班级修改
    async classedit() {
      const { data: res } = await this.$http.post(
        "http://www.eshareedu.cn/edusystems/api/classes/add",
        this.editform
      );
      // console.log(res);
      if (res.errCode == "10000") {
        this.classList();
        this.dialogFormVisiblea = false;
        this.$message.success("修改成功");
      } else {
        this.$message.error("修改失败");
      }
    },
    // 班级修改
    //排课
    paike() {
      this.dialogFormVisibleb = true;
    },
    //排课
    //助教显示隐藏
    none() {
      this.buhui = !this.buhui;
      // console.log(123);
    },
    //助教显示隐藏
    //批量排课
    none1() {
      this.buhui1 = true;
      this.buhui2 = true;
      // console.log(123);
    },
    none11() {
      this.buhui1 = false;
      this.buhui2 = false;
      // console.log(123);
    },
    // 批量排课
    //单选框1
    button1() {
      this.nangao1 = true;
      this.buhui2 = true;
      this.jieshu = false;
      this.nangao2 = false;
    },
    // 单选框1
    // 单选框2
    button2() {
      this.nangao1 = false;
      this.buhui2 = false;
      this.jieshu = true;
      this.nangao2 = true;
    },
    // 单选框2
    //复选框弹出时间选择
    ar() {
      this.xqr = !this.xqr;
      // alert(123)
    },
    a1() {
      this.xq1 = !this.xq1;
      // alert(123)
    },
    a2() {
      this.xq2 = !this.xq2;
      // alert(123)
    },
    a3() {
      this.xq3 = !this.xq3;
      // alert(123)
    },
    a4() {
      this.xq4 = !this.xq4;
      // alert(123)
    },
    a5() {
      this.xq5 = !this.xq5;
      // alert(123)
    },
    a6() {
      this.xq6 = !this.xq6;
      // alert(123)
    },
    //复选框弹出时间选择
    //课表kebiao
    async kbiao(row) {
      let classid=row.id
      // console.log(row);
      const {data:res} = await this.$http.get("http://www.eshareedu.cn/edusystems/api/coursetables/search",{params:{classid:classid}});
      if(res.errCode=="10000"){
        this.zong=res.data.list
      }
      // console.log(res);
      this.kbiaoaa = row;
      this.dialogFormVisiblec = true;
      // alert(123);
    },
    //课表kebiao
  },
};
</script>

<style lang="less" scoped>
.top {
  width: 100%;
  height: 55px;
  // background-color: aquamarine;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.12), 0 0 6px rgba(0, 0, 0, 0.04);
  //   box-shadow: 0px 3px 5px 3px red;
  margin-top: -10px;
  // border-bottom: 1px solid rgb(219, 219, 219);
  // border-top: 1px solid rgb(219, 219, 219);
  // border-left: 1px solid rgb(219, 219, 219);
  // border-right: 1px solid rgb(223, 223, 223);
  p {
    width: 117px;
    height: 55px;
    background-color: rgb(255, 255, 255);
    line-height: 55px;
    border-right: 1px solid rgb(216, 216, 216);
    // border-left: 1px solid rgb(212, 212, 212);
    // border-bottom: 1px solid rgb(212, 212, 212);
    // border-top: 1px solid rgb(212, 212, 212);
    text-align: center;
    font-weight: bold;
    font-size: 16px;
  }
  .button1 {
    font-size: 12px;
    height: 30px;
    margin-top: 12px;
    margin-left: 20px;
    // color: #9ea4b0;
  }
  .input-with-select {
    width: 400px;
    height: 30px;
    margin-top: 8px;
    margin-left: 10px;
  }
}

.box {
  //   box-shadow: 0 2px 4px rgba(0, 0, 0, 0.12), 0 0 6px rgba(0, 0, 0, 0.04);
  margin-top: 20px;
  width: 1377.2px;
  height: 100%;
  background-color: rgb(255, 255, 255);
  .block {
    margin-top: 50px;
    margin-left: 300px;
  }
  .nan1 {
    font-size: 12px;
    color: #419efe;
    // margin-left: 20px;
    cursor: pointer;
  }

  .nan2 {
    font-size: 12px;
    color: #419efe;
    margin-left: 20px;
    cursor: pointer;
  }
}
.nan {
  width: 1025px;
  height: 100px;
  // background-color: aqua;
  display: flex;
  .nan2 {
    width: 160px;
    margin-left: 40px;
    height: 87px;
    // background-color: aquamarine;
    span {
      // display: block;
      font-size: 15px;
      color: #000;
      margin-bottom: 10px;
      // color: #15b0ff;
    }
  }
}
.nana {
  width: 200px;
  height: 59px;
  // background-color: bisque;
  margin-top: 20px;
  margin-left: 25px;
}
.nanb {
  width: 999px;
  height: 88px;
  // background-color: blanchedalmond;
  margin-left: 30px;
  margin-top: 18px;
  display: flex;
  .nan2 {
    width: 210px;
    // margin-left: 40px;
    margin-left: 15px;
    height: 87px;
    // background-color: aquamarine;
    // span {
    //   // display: block;
    //   font-size: 15px;
    //   color: #000;
    //   margin-bottom: 10px;
    //   // color: #15b0ff;
    // }
  }
}
.nanc {
  width: 999px;
  height: 90px;
  margin-left: 45px;
  // background-color: blue;
  .nanzi {
    margin-top: 20px;
  }
  .nan2 {
    margin-top: 10px;
  }
}
.nand {
  width: 999px;
  height: 48px;
  // background-color: blueviolet;
  margin-left: 45px;
  display: flex;
  .nand1 {
    // width: 85px;
    // height: 22px;
    // background-color: red;
    font-size: 16.5px;
    font-weight: bold;
    color: #606266;
    line-height: 48px;
  }
  .nand2 {
    font-size: 14px;
    color: #4181fc;
    line-height: 48px;
    margin-left: 30px;
    cursor: pointer;
    // width: 72px;
    // height: 16px;
    // background-color: cadetblue;
  }
}
.nancc {
  width: 100%;
  margin-left: 45px;
  margin-top: 10px;
  display: flex;
  flex-wrap: wrap;
  .nancc5 {
    width: 450px;
    height: 100px;
    // background-color: rgb(101, 117, 84);
    .nanzi {
      color: #606266;
      font-size: 14px;
    }
    .nan2 {
      margin-top: 12px;
    }
  }
}
// 课表
.sss {
  width: 100%;
  display: flex;
  .kebiao1 {
    width: 23.5%;
    // background-color: #ebeef5;
    margin-top: -30px;
    .kebiaoa {
      width: 300px;
      height: 40px;
      background-color: #1890ff;
      border-top-left-radius: 8px;
      border-top-right-radius: 8px;
      // margin-top: -30px;
      span {
        // width: 200px;
        // height: 30px;
        color: #fff;
        line-height: 40px;
        margin-left: 30px;
      }
    }
    .kebiaob {
      width: 300px;
      height: 178.8px;
      // background-color: cornsilk;
      .kebiaob1 {
        width: 270px;
        height: 83.6px;
        // background-color: red;
        margin: auto;
        margin-top: 15px;
        .kebiao2 {
          width: 270px;
          height: 20px;
          // background-color: cyan;
          margin-top: 10px;
          span {
            font-weight: bold;
            color: #606266;
          }
        }
      }
      .kebiaob2 {
        width: 270px;
        height: 20px;
        // background-color: darkcyan;
        margin: auto;
        margin-top: 10px;
      }
      .kebiaob3 {
        width: 270px;
        height: 20px;
        margin: auto;
        margin-top: 20px;
        // background-color: darkgreen;
        display: flex;
        justify-content: space-between;
        span {
          color: #606266;
        }
      }
      .sybs {
        width: 270px;
        height: 20px;
        background-color: #ebeef5;
        margin: auto;
        margin-top: 10px;
      }
    }
    .kebiaoc {
      margin-top: 10px;
      width: 270px;
      height: 46.2px;
      // margin: auto;
      margin-left: 15px;
      // background-color: crimson;
      display: flex;
      justify-content: space-between;
      border-bottom: rgb(207, 207, 207) 2px solid;
      .span1 {
        line-height: 46.2px;
        color: #606266;
      }
      .span2 {
        line-height: 46.2px;
        color: rgb(0, 110, 255);
        cursor: pointer;
      }
    }
    .kebb {
      width: 270px;
      margin-left: 15px;
      height: 388px;
      background-color: #ebeef5;
    }
  }
  .kebiaorl {
    width: 75%;
    height: 800px;
    margin-top: -30px;
    // background-color: darkorange;
    .kebiaorl1 {
      width: 100%;
      height: 60px;
      // background-color: aqua;
      .rili {
        width: 100%;
      }
    }
  }
}
// 课表
// 排课
.acca {
  width: 90px;
  height: 45px;
  margin-top: 10px;
  background: rgb(245, 245, 245);
  border-radius: 4px;
  margin-left: 10px;
  display: flex;
  .accb {
    width: 5px;
    height: 45px;
    background-color: blue;
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
  }
  .accc {
    width: 75px;
    height: 45px;
    // background-color: blueviolet;
    .accd {
      width: 75px;
      height: 15px;
      // background-color: burlywood;
      margin-top: 5px;
      font-size: 12px;
      margin-left: 5px;
      color: #000000;
    }
    .accd2 {
      width: 75px;
      height: 15px;
      margin-top: 5px;
      justify-content: space-between;
      // background-color: burlywood;
      span {
        font-size: 12px;
        color: #7c8c9c;
        margin-left: 5px;
      }
    }
  }
}
// 排课
</style>
